import { Form, Input, Button } from 'antd'
import { apiLogin } from '../api'
import Cookie from 'js-cookie'
const Login = () => {

    // 默认参数 data 为输入框中输入的内容
    const onFinish = (data) => {
        apiLogin(data).then(res => {
            Cookie.set('token', res.token, {expires: 3})

            // 跳转页面
            window.location.href = '/'
        })
    }

    return <div>
        <Form
            name="basic"
            onFinish={onFinish} // 校验成功触发的回调函数
            autoComplete="off"
        >
            <Form.Item
                label="Username"
                name="username"
                rules={[
                    {
                        required: true, // 非空校验
                        message: 'Please input your username!',
                    },
                ]}
            >
                <Input />
            </Form.Item>

            <Form.Item
                label="Password"
                name="password"
                rules={[
                    {
                        required: true,
                        message: 'Please input your password!',
                    },
                ]}
            >
                <Input.Password />
            </Form.Item>


            <Form.Item
            >
                <Button type="primary" htmlType="submit">
                    登录
                </Button>
            </Form.Item>
        </Form>
    </div>
}

export default Login